<template>
	<view>
		<view class="recognition">
			<view class='scanthing' @tap="bindImageSerach">
				<image src="../../static/recognition/Scanthing.png" mode="widthFix"></image>

			</view>
			<view><text>拍照识别</text></view>

			<view class='asr' @tap="startRecord" @longpress="handleRecordStart" @touchmove="handleTouchMove"
				@touchend="handleRecordStop">
				<image src="../../static/recognition/asr.png" mode="widthFix"></image>

			</view>
			<view><text>语音识别</text></view>
		</view>
	</view>
</template>

<script>
	import config from '../../config.js'
	import utils from '../../common/until.js';
	const recorderManager = uni.getRecorderManager();
	export default {
		data() {
			return {

				is_show: false,
				detail: '',
				seah_name: '',
				is_clock: false,
				keywords: '',

				height: '32'
			}
		},
		onLoad: function() {
			var that = this;
			uni.getSystemInfo({
				success: function(res) {
					that.height = res.statusBarHeight
				},
			})

			//对停止录音进行监控
			recorderManager.onStop((res) => {
				//此时先判断是否需要发送录音
				if (that.is_clock == true) {
					//对录音时长进行判断，少于2s的不进行发送，并做出提示
					if (res.duration < 2000) {
						uni.showToast({
							title: '录音时间太短，请长按录音',
							icon: 'none',
							duration: 1000
						})
					} else {
						const {
							tempFilePath
						} = res;
						uni.showLoading({
							title: '语音检索中',
						})
						//上传录制的音频
						uni.uploadFile({
							url: config.requestUrl + 'RubbishRefuse/uploadVoice',
							filePath: tempFilePath,
							name: 'voice',
							formData: {
								cid: uni.getStorageSync('cid')
							},
							success: function(event) {
								var datas = JSON.parse(event.data);
								if (datas.status == 0) {
									uni.hideLoading()
									if (datas.result.list.length > 0) {
										// that.setData({
										//   is_show: true,
										//   detail: datas.result.list,
										//   seah_name: datas.result.voice,
										//   keywords: datas.result.voice
										// })

										that.is_show = true
										that.detail = datas.result.list
										that.seah_name = datas.result.voice
										that.keywords = datas.result.voice
									} else {
										uni.showToast({
											title: '如此聪明伶俐的我居然会词穷，我要喊我父亲大人送我去深造~',
											icon: 'none',
											duration: 2000
										})
									}
								} else {
									uni.showToast({
										title: datas.msg,
										icon: 'none',
										duration: 2000
									})
								}
							}
						})
					}
				} else {
					uni.showToast({
						title: '录音已取消',
						icon: 'none',
						duration: 2000
					})
				}
			})
			//监控录音异常情况
			recorderManager.onError((res) => {
				if (res['errMsg'] != 'operateRecorder:fail recorder not start') {
					uni.showModal({
						title: '你拒绝使用录音功能，语音识别功能将无法正常使用',
						content: '是否重新授权使用你的录音功能',
						success: function(data) {
							if (data.cancel) {
								uni.showToast({
									title: '拒绝授权',
									icon: 'none',
									duration: 1000
								})
							} else if (data.confirm) {
								uni.openSetting({
									success: function(dataAu) {
										if (dataAu.authSetting["scope.record"] !=
											true) {
											uni.showToast({
												title: '授权失败',
												icon: 'none',
												duration: 1000
											})
										} else {
											uni.showToast({
												title: '授权成功，请长按录音',
												icon: 'none',
												duration: 1000
											})
										}
									}
								})
							}
						}
					})
				}
			})
		},
		methods: {
			//拍照识别
			bindImageSerach: function() {
				this.is_show = false
				var that = this;
				uni.chooseImage({
					count: 1,
					sizeType: ['original', 'compressed'],
					sourceType: ['album', 'camera'],
					success(res) {
						uni.showLoading({
							title: '上传检索中',
						})
						const tempFilePaths = res.tempFilePaths;
						uni.uploadFile({
							url: config.requestUrl + 'RubbishRefuse/upload',
							filePath: tempFilePaths[0],
							name: 'file',
							formData: {
								cid: uni.getStorageSync('cid')
							},
							success(event) {

								var datas = JSON.parse(event.data);
								if (datas.status == 0) {
									uni.hideLoading()
									if (datas.result) {
										if (datas.result.length > 0) {
											that.is_show = true,
												that.detail = datas.result,
												that.seah_name = ''
										} else {
											uni.showToast({
												title: '如此聪明伶俐的我居然会词穷，我要喊我父亲大人送我去深造~',
												icon: 'none',
												duration: 2000
											})
										}
									} else {
										uni.showToast({
											title: '如此聪明伶俐的我居然会词穷，我要喊我父亲大人送我去深造~',
											icon: 'none',
											duration: 2000
										})
									}
								} else {
									uni.showToast({
										title: datas.msg,
										icon: 'none',
										duration: 2000
									})
								}
							}
						})
					}
				})
			},
			startRecord() {
				uni.showToast({
					title: '请长按录音',
					icon: 'none',
					duration: 1000
				})
			},
			//语音识别 开始录音
			handleRecordStart(e) {
				this.is_clock = true, //长按时应设置为true，为可发送状态
					this.startPoint = e.touches[0], //记录触摸点的坐标信息
					this.audios = {
						'img': 'stop',
						'name': '录音中'
					},
					this.is_show = false
				//录音参数
				const options = {
					duration: 10000,
					sampleRate: 16000,
					numberOfChannels: 1,
					encodeBitRate: 48000,
					format: 'mp3'
				}
				//开启录音
				recorderManager.start(options);
				uni.showToast({
					title: '正在录音，往下滑动取消发送',
					icon: 'none',
					duration: 10000
				})
			},
			//停止录音
			handleRecordStop() {
				uni.hideToast(); //结束录音、隐藏Toast提示框
				this.audios = {
					'img': 'voice',
					'name': '语音查询'
				}
				recorderManager.stop() //结束录音
			},
			//滑动取消发送
			handleTouchMove: function(e) {
				//计算距离，当滑动的垂直距离大于25时，则取消发送语音
				if (Math.abs(e.touches[e.touches.length - 1].clientY - this.startPoint.clientY) > 35) {
					uni.showToast({
						title: "松开手指,取消发送",
						icon: "none",
						duration: 10000
					});
					this.is_clock = false //设置为不发送语音
				} else {
					uni.showToast({
						title: '正在录音，往下滑动取消发送',
						icon: 'none',
						duration: 10000
					})
					this.is_clock = true
				}
			}
		}
	}
</script>

<style>
	.recognition {
		margin: 100rpx 225rpx;
	}

	.scanthing,
	.asr {
		width: 100%;
		height: 350rpx;
		margin: 20rpx auto;
	}

	.recognition image {
		width: 300rpx;
		height: 200rpx;
	}

	text {
		width: 100%;
		/* height: 50rpx; */
		font-size: 22px;
		margin: 0 60rpx;
	}
</style>